<template>
	<view class="counter">
		<view class="header">
			<view class="circle"></view>
			<view class="header_text">{{ baseData.quotaName }}</view>
		</view>

		<view class="note" v-if="baseData.remark !== null && baseData.remark !== ''">
			<view class="note_left">备注：</view>
			<view class="note_right">
				<rich-text :nodes="baseData.remark"></rich-text>
			</view>
		</view>

		<view
			class="card_auxiliary"
			v-if="
				(baseData.mainProductShowType == 1 && baseData.tabValue == 2) ||
				(baseData.mainProductShowType == 1 && baseData.tabValue == 1) ||
				(baseData.mainProductShowType == 2 && baseData.tabValue == 1 && materialObjZHU.customerQuotaProductList.length > 0)
			"
		>
			<view class="cardmain_top">
				<view class="cardmain_top_left">主材</view>
				<view class="cardmain_top_right">{{ materialObjZHU.customerQuotaProductList.length }}款选{{ materialObjZHU?.productCheckedNum }}（指定商品)</view>
			</view>
			<view class="cardmain_top_line"></view>
			<view class="card_auxiliary_content">
				<view class="card_auxiliary_item" v-for="item in materialObjZHU?.customerQuotaProductList">
					<!-- 					<image class="auxiliary_itemleft" mode="aspectFit" src=""></image> -->
					<view class="auxiliary_itemright" style="margin-left: 20rpx">
						<view class="auxiliary_itemright_texttop">
							{{ item.productAliasName }}
						</view>
						<view class="auxiliary_itemright_textdown">
							<view class="itemright_textdown_com">单价：</view>
							<view class="itemright_textdown_com" style="color: #ff4000; font-size: 28rpx">￥{{ item.quoteUnitPrice }}</view>
							<view class="itemright_textdown_com">/件</view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<view
			class="cardmain"
			v-if="
				(baseData.mainProductShowType == 2 && baseData.tabValue == 2) ||
				(baseData.mainProductShowType == 2 && baseData.tabValue == 1 && materialObjZHU.customerQuotaProductList.length == 0)
			"
		>
			<view class="cardmain_top">
				<view class="cardmain_top_left">主材</view>
				<view class="cardmain_top_right">共{{ limitProductNum }}款商品</view>
			</view>
			<view class="line"></view>
			<view class="card_catge">商品分类</view>
			<view class="card_catge_list">
				<view class="card_catge_item" :class="item.show == true ? 'card_showline' : ''" v-for="(item, index) in mainarrylist" @click="selectMainlist(item, index)">
					<view class="card_catge_itemtext" :class="item.show == true ? 'card_showline_text' : ''">
						{{ item.categoryName || item.name }}
					</view>
				</view>
			</view>
			<view class="card_publictitle" style="margin-top: 20rpx">属性筛选</view>
			<view class="card_attribute">
				<view class="card_attribute_text" v-for="item in showChildlist">
					{{ item.stastsName }}
				</view>
				<view style="padding-bottom: 32rpx"></view>
			</view>
		</view>

		<view
			class="card_auxiliary"
			v-if="
				(baseData.auxiliaryProductShowType == 1 && baseData.tabValue == 2) ||
				(baseData.auxiliaryProductShowType == 1 && baseData.tabValue == 1) ||
				(baseData.auxiliaryProductShowType == 2 && baseData.tabValue == 1 && materialObj.customerQuotaProductList.length > 0)
			"
		>
			<view class="cardmain_top">
				<view class="cardmain_top_left">辅材</view>
				<view class="cardmain_top_right">{{ materialObj.customerQuotaProductList.length }}款选{{ materialObj.productCheckedNum }}（指定商品)</view>
			</view>
			<view class="cardmain_top_line"></view>
			<view class="card_auxiliary_content">
				<view class="card_auxiliary_item" v-for="item in materialObj?.customerQuotaProductList">
					<!-- 					<image class="auxiliary_itemleft" mode="aspectFit" src=""></image> -->
					<view class="auxiliary_itemright" style="margin-left: 20rpx">
						<view class="auxiliary_itemright_texttop">
							{{ item.productAliasName }}
						</view>
						<view class="auxiliary_itemright_textdown">
							<view class="itemright_textdown_com">单价：</view>
							<view class="itemright_textdown_com" style="color: #ff4000; font-size: 28rpx">￥{{ item.quoteUnitPrice }}</view>
							<view class="itemright_textdown_com">/件</view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<view
			class="cardmain"
			v-if="
				(baseData.auxiliaryProductShowType == 2 && baseData.tabValue == 2) ||
				(baseData.auxiliaryProductShowType == 2 && baseData.tabValue == 1 && materialObj.customerQuotaProductList.length == 0)
			"
		>
			<view class="cardmain_top">
				<view class="cardmain_top_left">辅材</view>
				<view class="cardmain_top_right">共{{ limitProductNumFU }}款商品</view>
			</view>
			<view class="line"></view>

			<view class="card_catge">商品分类</view>
			<view class="card_catge_list">
				<view class="card_catge_item" :class="item.show == true ? 'card_showline' : ''" v-for="(item, index) in mainarrylistFU" @click="selectMainlistFU(item, index)">
					<view class="card_catge_itemtext" :class="item.show == true ? 'card_showline_text' : ''">
						{{ item.categoryName || item.name }}
					</view>
				</view>
			</view>
			<view class="card_publictitle" style="margin-top: 20rpx">属性筛选</view>
			<view class="card_attribute">
				<view class="card_attribute_text" v-for="item in showChildlistFU">
					{{ item.stastsName }}
				</view>
				<view style="padding-bottom: 32rpx"></view>
			</view>
		</view>

		<view class="card_people" v-if="baseData.workerNum !== 0">
			<view class="cardmain_top">
				<view class="cardmain_top_left">人工</view>
				<view class="cardmain_top_right">费用合计：¥{{ wordlist.quoteMoney || wordlist.quoteTotalPrice }}</view>
			</view>
			<view class="cardmain_top_line"></view>
			<view class="card_people_content">
				<view class="card_people_item" v-for="item in wordlist.customerQuotaWorkerList" v-if="showpeople">
					<view class="card_people_title">{{ item.showworkerType }}</view>
					<view class="card_people_line"></view>
					<view class="card_people_value">
						<view class="">{{ item.workerNum }}</view>
						<view class="">￥{{ item.quoteUnitPrice }}</view>
						<view class="">{{ item.showunit }}</view>
					</view>
					<view class="card_people_valuetwo">
						<view class="">数量</view>
						<view class="">单价</view>
						<view class="">计费方式</view>
					</view>
				</view>

				<view class="card_people_item" v-for="item in wordlist.quotaWorkerVOList" v-if="!showpeople">
					<view class="card_people_title">{{ item.showworkerType }}</view>
					<view class="card_people_line"></view>
					<view class="card_people_value">
						<view class="">{{ item.workerNum }}</view>
						<view class="">￥{{ item.quoteUnitPrice }}</view>
						<view class="">{{ item.showunit }}</view>
					</view>
					<view class="card_people_valuetwo">
						<view class="">数量</view>
						<view class="">单价</view>
						<view class="">计费方式</view>
					</view>
				</view>
			</view>
		</view>

		<view class="card-container_top" v-if="baseData.mainProductShowType == null || baseData.auxiliaryProductShowType == null || baseData.workerNum == 0">
			<view class="card-container_countent" v-if="baseData.mainProductShowType == null">
				<view class="card-container_left">主材</view>
				<view class="card-container_right">
					费用合计
					<view style="color: red">：¥{{ baseData.mainQuoteMoney }}</view>
				</view>
			</view>
			<view class="card-container_line" v-if="baseData.mainProductShowType == null"></view>
			<view class="card-container_countent" v-if="baseData.auxiliaryProductShowType == null">
				<view class="card-container_left">辅材</view>
				<view class="card-container_right">
					费用合计
					<view style="color: red">：¥{{ baseData.auxiliaryQuoteMoney }}</view>
				</view>
			</view>
			<view class="card-container_line" v-if="baseData.auxiliaryProductShowType == null"></view>
			<view class="card-container_countent" v-if="baseData.workerNum == 0">
				<view class="card-container_left">人工</view>
				<view class="card-container_right">
					费用合计
					<view style="color: red">：¥{{ baseData.workerQuoteMoney }}</view>
				</view>
			</view>
		</view>
		<template v-if="config.isStandard">
			<view class="standard_title">工艺标准描述</view>
			<view class="standard_countent">
				{{ baseData.standardDesc }}
			</view>

			<view class="standard_title">优劣说明</view>
			<view class="standard_countent">
				{{ baseData.shortcomingDesc }}
			</view>

			<view class="standard_title">工艺标准图片</view>
			<view class="pictute_countent">
				<image class="pictute_item" mode="aspectFit" v-for="item in baseData.picUrls?.split(',') || []" :src="item" @click="onPreview(item)"></image>
			</view>

			<view class="standard_title">工艺标准视频</view>
			<view class="video_countent">
				<video class="video_item" v-for="item in baseData.videoUrls?.split(',') || []" :src="item"></video>
			</view>
		</template>
		<view style="height: 64rpx"></view>
	</view>
</template>

<script setup>
import { ref } from 'vue';
import { onLoad, onUnload } from '@dcloudio/uni-app';
import circleTitle from '@/components/circle-title/index.vue';
import {
	getWorkerList,
	getMainMaterial,
	quotaProductConditionList,
	getQuotaWorker,
	getProductList,
	getMainProductsByContentId,
	getAuxiliaryProductsByContentId,
	categoryListV2,
	queryStastsList,
	getDict
} from '@/api/budgetQuota';
const showpeople = ref(true);
const baseData = ref({});
const wordlist = ref({
	customerQuotaWorkerList: []
});
const materialObj = ref({
	customerQuotaProductList: []
});
const materialObjZHU = ref({
	customerQuotaProductList: []
});
const mainObj = ref({
	voList: []
});
const mainarrylist = ref([]);
const showChildlist = ref([]);
const limitProductNum = ref(0);
const mainObjFU = ref({
	voList: []
});
const mainarrylistFU = ref([]);
const showChildlistFU = ref([]);
const limitProductNumFU = ref(0);
const dictData = ref([]);
const dictDataunit = ref([]);
const config = ref({});
onLoad((options) => {
	config.value = uni.getStorageSync('config');
	// 从路由参数获取动态标题
	const decodedData = JSON.parse(decodeURIComponent(options.data));
	const dynamicTitle = decodedData.spaceQuotatitle || '默认标题';
	uni.setNavigationBarTitle({
		title: dynamicTitle
	});
	baseData.value = decodedData;
	console.log(decodedData);
	if (baseData.value.mainProductShowType == 2) {
		getcatgectlist(baseData.value.quotaId);
	}
	if (baseData.value.mainProductShowType == 1) {
		getalldetailZHU();
	}
	if (baseData.value.auxiliaryProductShowType == 2) {
		getcatgectlistFU(baseData.value.quotaId);
	}
	if (baseData.value.auxiliaryProductShowType == 1) {
		getalldetail();
	}
	if (baseData.value.tabValue == 2) {
		getWorklisttwo();
	} else {
		getWorklist();
	}
});
onUnload(() => {
	uni.setStorage({
		key: 'yourKey',
		data: 'yourData'
	});
});
const onPreview = (v) => {
	let arry = [v];
	uni.previewImage({
		urls: arry
	});
};
//人工
const getWorklist = async () => {
	const dictWorkertype = await getDict('quota_worker_type');
	dictData.value = dictWorkertype.data;
	const dictUnit = await getDict('shop_unit');
	dictDataunit.value = dictUnit.data;
	const { data } = await getWorkerList(baseData.value.contentId);

	showpeople.value = true;
	wordlist.value = data;
	wordlist.value.customerQuotaWorkerList.map((item) => {
		item.showworkerType = dictData.value.find((v) => v.dictValue == item.workerType).dictLabel;
		item.showunit = dictDataunit.value.find((v) => v.dictValue == item.unit).dictLabel;
	});
};
const getWorklisttwo = async () => {
	const dictWorkertype = await getDict('quota_worker_type');
	dictData.value = dictWorkertype.data;
	const dictUnit = await getDict('shop_unit');
	dictDataunit.value = dictUnit.data;
	const { data } = await getQuotaWorker(baseData.value.quotaId);
	if (data.quotaWorkerVOList.length == 0) {
		baseData.value.workerNum = 0;
	}
	showpeople.value = false;
	wordlist.value = data;
	wordlist.value.quotaWorkerVOList.map((item) => {
		item.showworkerType = dictData.value.find((v) => v.dictValue == item.workerType).dictLabel;
		item.showunit = dictDataunit.value.find((v) => v.dictValue == item.unit).dictLabel;
	});
};
//辅材获取 固定商品
const getalldetail = async () => {
	if (baseData.value.tabValue == 1) {
		const { data } = await getAuxiliaryProductsByContentId(baseData.value.contentId);
		materialObj.value = data;
	}

	if (baseData.value.tabValue == 2) {
		const { data } = await getProductList(baseData.value.quotaId, 2);
		materialObj.value = data;
		materialObj.value.customerQuotaProductList = data.productVOList;
	}
};
//主材获取固定商品
const getalldetailZHU = async () => {
	if (baseData.value.tabValue == 1) {
		const { data } = await getMainProductsByContentId(baseData.value.contentId);
		materialObjZHU.value = data;
	}

	if (baseData.value.tabValue == 2) {
		const { data } = await getProductList(baseData.value.quotaId, 1);
		materialObjZHU.value = data;
		materialObjZHU.value.customerQuotaProductList = data.productVOList;
	}
};
//主材获取条件商品
const getcatgectlist = async (v) => {
	const obj = {
		productType: 1,
		quotaId: v
	};
	if (baseData.value.tabValue == 2) {
		const { data } = await quotaProductConditionList(obj.quotaId, obj.productType);
		mainObj.value = data;
		mainarrylist.value = mainObj.value.voList;
		if (mainarrylist.value.length !== 0) {
			mainarrylist.value.forEach((item) => {
				item.show = false;
			});
			mainarrylist.value[0].show = true;
			limitProductNum.value = mainarrylist.value[0].limitProductNum;
			showChildlist.value = mainarrylist.value[0].productProList;
		}
	}
	if (baseData.value.tabValue == 1) {
		let Material = {
			productType: 1,
			budgetId: baseData.value.budgetId,
			contentId: baseData.value.contentId
		};
		const { data } = await getMainMaterial(Material);
		materialObjZHU.value = data;
		if (materialObjZHU.value.customerQuotaProductList.length == 0) {
			const { data } = await categoryListV2(Material);
			mainarrylist.value = data;
			if (mainarrylist.value.length !== 0) {
				mainarrylist.value.forEach((item) => {
					item.show = false;
				});
				mainarrylist.value[0].show = true;
				let obj = {
					categoryId: mainarrylist.value[0].categoryId,
					productType: 1
				};
				getStateslist(obj);
			}
		}
	}
};

//辅材 条件查询
const getcatgectlistFU = async (v) => {
	const obj = {
		productType: 2,
		quotaId: v
	};
	if (baseData.value.tabValue == 2) {
		const { data } = await quotaProductConditionList(obj.quotaId, obj.productType);
		mainObjFU.value = data;
		mainarrylistFU.value = mainObjFU.value.voList;
		if (mainarrylistFU.value.length !== 0) {
			mainarrylistFU.value.forEach((item) => {
				item.show = false;
			});
			mainarrylistFU.value[0].show = true;
			limitProductNumFU.value = mainarrylistFU.value[0].limitProductNum;
			showChildlistFU.value = mainarrylistFU.value[0].productProList;
		}
	}

	if (baseData.value.tabValue == 1) {
		let Material = {
			productType: 2,
			budgetId: baseData.value.budgetId,
			contentId: baseData.value.contentId
		};
		const { data } = await getMainMaterial(Material);
		materialObj.value = data;
		if (materialObj.value.customerQuotaProductList.length == 0) {
			const { data } = await categoryListV2(Material);
			mainarrylistFU.value = data;
			if (mainarrylistFU.value.length !== 0) {
				mainarrylistFU.value.map((item) => {
					item.show = false;
				});
				mainarrylistFU.value[0].show = true;
				let obj = {
					categoryId: mainarrylistFU.value[0].categoryId,
					productType: 2
				};
				getStateslist(obj);
			}
		}
	}
};
//选择商品分类主
const selectMainlist = (item, index) => {
	if (baseData.value.tabValue == 2) {
		mainarrylist.value.forEach((v) => {
			v.show = false;
		});
		mainarrylist.value[index].show = true;
		showChildlist.value = item.productProList;
		limitProductNum.value = item.limitProductNum;
	} else {
		let obj = {
			categoryId: item.categoryId,
			productType: 1
		};
		getStateslist(obj);
	}
};
//选择商品分类辅
const selectMainlistFU = (item, index) => {
	if (baseData.value.tabValue == 2) {
		mainarrylistFU.value.forEach((v) => {
			v.show = false;
		});
		mainarrylistFU.value[index].show = true;
		showChildlistFU.value = item.productProList;
		limitProductNumFU.value = item.limitProductNum;
	} else {
		let obj = {
			categoryId: item.categoryId,
			productType: 2
		};
		getStateslist(obj);
	}
};
const getStateslist = async (obj) => {
	const { data } = await queryStastsList(obj);
	obj.productType == 1 ? (showChildlist.value = data) : (showChildlistFU.value = data);
};
</script>

<style lang="scss" scoped>
@import 'index';
</style>
